<template>
<div class="app-container">
    <loading v-show="loading"></loading>
    <el-card class="box-card" style="margin-bottom:1%;">
      <div slot="header" class="clearfix">
        <span>考核周期基本信息</span>
        <div class="btn-box">
        <el-button
              size="mini"
              type="primary"
              @click="$router.back(-1)" style="margin-right:20px;">返 回</el-button>
        </div>
      </div>
      <el-form ref="detailData"  :model="detailData" label-width="140px" class="detailStyle">
        <el-row>
          <el-col :span="12">
            <span class="labelSpan">
              考核周期名称:
            </span>
            <span class="valueSpan">{{detailData.assessmenCycle}}</span>
          </el-col>
          <el-col :span="12">
            <span class="labelSpan">考核周期起始时间: </span>
            <span class="valueSpan">{{detailData.assessmenBeginTime}} -- {{detailData.assessmenEndTime}}</span>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <el-card class="box-card" style="margin-bottom:1%;">
        <div slot="header" class="clearfix">
          <span>满意度评测</span>
          <el-button
              size="mini"
              v-if="dzbMydcpDics.length !== 0"
              type="primary"
              icon="el-icon-plus"
              @click="saveReport" style="float:right;margin-right:20px">提交</el-button>
        </div>
        <div>
          <el-radio v-for="item in selfReportedDataOne" v-model="saveData.score" @change="setValue(item.score,item.description)" :key="item.mydcpDicKey" :label="item.score" border>{{item.description+item.score}}</el-radio>
        </div>
        <div v-for="(item,index) in selfReportedDataTwo" ref="dzbMydcpwtDetails">
          <p ref="description">{{item.description}}</p>
          <el-input
            type="textarea"
            :rows="2"
            ref="textarea"
            placeholder="请输入内容"
            >
          </el-input>
        </div>
      </el-card>
</div>
</template>
<script>
import Loading from '@/components/loading/loading'
import { getSelfReported, savaReportData } from '@/api/partyBranch/assessment'
export default {
  components: {
    Loading
  },
  data() {
    return {
      searchData: {
        cycleAssessmenKey: ''
      },
      num: 0,
      loading: false,
      detailData: {
        assessmenBeginTime: '',
        assessmenCycle: '',
        assessmenEndTime: '',
        createTime: '',
        cycleAssessmenKey: '',
        modifyTime: '',
        releaseState: ''
      },
      dzbMydcpDics: [],
      typeOfSatisfaction: [],
      selfReportedDataOne: [],
      selfReportedDataTwo: [],
      addform: [{
        assessmenDetailKey: '',
        score: 0
      }],
      rules: {
        score: [
          { required: true, message: '请输入考核周期名称', trigger: 'blur' }
        ]
      },
      saveData: {
        yearAssessmenKey: '',
        partyOrgType: '',
        description: '',
        score: '',
        data: {
          dzbMydcpwtDetails: [
          ]
        }
      },
      org: []
    }
  },
  created() {
    this.loading = true
    this.searchData.cycleAssessmenKey = this.$route.query.cycleAssessmenKey
    this.getgetSelfReportedList()
  },
  methods: {
    setValue(value, text) {
      this.saveData.description = text
    },
    getgetSelfReportedList() {
      getSelfReported(this.searchData).then(response => {
        this.detailData = response.data.dzbCycleAssessmen
        this.saveData.yearAssessmenKey = this.detailData.cycleAssessmenKey
        this.org = response.data.org
        this.saveData.partyOrgType = this.org.partyOrgType
        this.dzbMydcpDics = response.data.dzbMydcpDics
        this.typeOfSatisfaction = response.data.typeOfSatisfaction
        this.dzbMydcpDics.forEach((element) => {
          const elementOne = this.typeOfSatisfaction.find(item => item.paramValue === '001' && item.paramValue === element.type)
          const elementTwo = this.typeOfSatisfaction.find(item => item.paramValue === '002' && item.paramValue === element.type)
          if (elementOne) {
            const data = Object.assign(element, elementOne)
            this.selfReportedDataOne.push(data)
          }
          if (elementTwo) {
            const data = Object.assign(element, elementTwo)
            this.selfReportedDataTwo.push(data)
          }
        })
        this.loading = false
      }).catch(error => {
        this.loading = false
        console.log(error)
      })
    },
    saveReport() {
      if (this.saveData.score) {
        for (var item in this.$refs.description) {
          this.saveData.data.dzbMydcpwtDetails.push({
            description: this.$refs.description[item].innerText,
            answerContent: this.$refs.textarea[item].$data.currentValue
          })
        }
        this.loading = true
        this.saveData.data = JSON.stringify(this.saveData.data)
        savaReportData(this.saveData).then(response => {
          this.loading = false
          this.saveData = {
            data: {
              dzbMydcpwtDetails: []
            }
          }
          this.$router.push({
            path: 'satisfactionAssessment',
            name: '满意度测评'
          })
          this.saveData.partyOrgType = this.org.partyOrgType
          this.saveData.yearAssessmenKey = this.detailData.cycleAssessmenKey
        }).catch(error => {
          this.saveData.data = JSON.parse(this.saveData.data)
          this.saveData.partyOrgType = this.org.partyOrgType
          this.saveData.yearAssessmenKey = this.detailData.cycleAssessmenKey
          this.loading = false
          console.log(error)
        })
      } else {
        this.$message({
          showClose: true,
          message: '请选择满意度评分',
          type: 'warning'
        })
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.el-form-item{margin-bottom:0;}
</style>
